<%--
    Document   : agregarObjetoPerdido
    Created on : 16/11/2010, 04:23:47 PM
    Author     : rafael
--%>

<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic"%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<%@ include file='../Templates/security.jsp' %>

<h1 class="title">Gestión de Empleados</h1>
<p class="meta"></p>
<center>
    <h2>Agregar Empleado</h2>
    <html:form action="/agregarPersona" styleId="agregarPersonaForm" onsubmit="return sendForm('agregarPersonaForm','agregarPersona','center');" >
        <br>
        <html:errors property = "persona_agregada"/>
        <html:errors property = "persona_No_agregada"/>
        <html:errors property = "persona_ya_Existe"/>

        <html:hidden property="profesion" value="Empleado"/>
        <html:hidden property="activo" value="si"/>
        <html:hidden styleId="micombo6" property="transporte" value="no"/>
        <div id="datosEmpleado">
            <table cellspacing="5px">
                <tr><td colspan="2"><br>Datos Personales<hr></td></tr>
                <tr>
                    <td><font color="red">*&nbsp;</font>Cédula:</td>
                    <td>
                        <html:select styleId="micombo1" property="voe">
                            <html:option value="V">V</html:option>
                            <html:option value="E">E</html:option>
                        </html:select> -
                        <html:text size="17" maxlength="12" property="ci"/>

                        <html:errors property = "falta_Cedula"/>
                        <html:errors property = "invalid_Cedula"/>
                    </td>
                </tr>
                <tr>
                    <td><font color="red">*&nbsp;</font>Primer Nombre:</td>
                    <td>
                        <html:text size="25" maxlength="20" property="nombre1"/>

                        <html:errors property = "falta_Nombre"/>
                        <html:errors property = "long_Nombre"/>
                        <html:errors property = "invalid_caracter_N1"/>
                    </td>
                </tr>
                <tr>
                    <td>&nbsp;&nbsp;Segundo Nombre:</td>
                    <td>
                        <html:text size="25" maxlength="20" property="nombre2"/>
                        <html:errors property = "invalid_caracter_N2"/>
                    </td>
                </tr>
                <tr>
                    <td><font color="red">*&nbsp;</font>Primer Apellido:</td>
                    <td>
                        <html:text size="25" maxlength="20" property="apellido1"/>

                        <html:errors property = "falta_Apellido"/>
                        <html:errors property = "long_Apellido"/>
                        <html:errors property = "invalid_caracter_A1"/>
                    </td>
                </tr>
                <tr>
                    <td>&nbsp;&nbsp;Segundo Apellido:</td>
                    <td>
                        <html:text size="25" maxlength="20" property="apellido2"/>
                        <html:errors property = "invalid_caracter_A2"/>
                    </td>
                </tr>
                <tr>
                    <td><font color="red">*&nbsp;</font>Fecha de Nacimiento:</td>
                    <td>
                        <html:text size="25" maxlength="20" property="fechaNac" styleId="fechaNac"/>

                        <html:errors property = "faltaFecha"/>
                        <html:errors property = "invalid_fechaNac"/>
                    </td>
                </tr>
                <tr>
                    <td>&nbsp;&nbsp;Sexo:</td>
                    <td>

                        <html:select styleId="micombo2" property="sexo">
                            <html:option value="m">M</html:option>
                            <html:option value="f">F</html:option>
                        </html:select>
                    </td>
                </tr>
                <tr>
                    <td>&nbsp;&nbsp;Estado Civil:</td>
                    <td>
                        <html:select styleId="micombo3" property="edoCivil">
                            <html:option value="Soltero">Soltero(a)</html:option>
                            <html:option value="Casado">Casado(a)</html:option>
                            <html:option value="Viudo">Viudo(a)</html:option>
                            <html:option value="Divorciado">Divorciado(a)</html:option>
                            <html:option value="Concubinato">Concubinato(a)</html:option>
                        </html:select>
                    </td>
                </tr>
                <tr>
                    <td>&nbsp;&nbsp;Teléfono:</td>
                    <td>
                        <html:text size="25" maxlength="11" property="telefono"/>
                        &nbsp;Ej.&nbsp;02125555555
                        <html:errors property = "telefono_letras"/>
                    </td>
                </tr>
                <tr>
                    <td>&nbsp;&nbsp;Email:</td>
                    <td>
                        <html:text size="25" maxlength="30" property="email"/>
                        &nbsp;Ej.&nbsp;Pperez@gmail.com
                        <html:errors property = "invalid_Email"/>
                    </td>
                </tr>
                <tr><td colspan="2"><br>Datos Laborales<hr></td></tr>
                <tr>
                    <td><font color="red">*&nbsp;</font>Sede:</td>
                    <td>
                        <select id="Sedes" name="sede" onchange="listCargosSede(value)"></select>
                    </td>
                </tr>
                <tr>
                    <td><font color="red">*&nbsp;</font>Cargo:</td>
                    <td>
                        <select id="Cargo" name="cargo" onchange="listaPuestos(value)"></select>
                    </td>
                </tr>
                <tr>
                    <td><font color="red">*&nbsp;</font>Puesto Trabajo:</td>
                    <td>
                        <select id="Puestos" name="puestoTrabajo"></select>
                    </td>
                </tr>
                <tr>
                    <td>&nbsp;&nbsp;Tipo:</td>
                    <td>
                        <html:select styleId="micombo4" property="tipoPersonal">
                            <html:option value="">-</html:option>
                            <html:option value="Fijo">Fijo</html:option>
                            <html:option value="Suplente">Suplente</html:option>
                            <html:option value="Contratado">Contratado</html:option>
                        </html:select>
                    </td>
                </tr>
                <tr>
                    <td>&nbsp;&nbsp;Horario:</td>
                    <td>
                        <select id="Horarios" name ="idHorario"></select>
                    </td>
                </tr>
                <tr>
                    <td>&nbsp;&nbsp;Función del Empleado:</td>
                    <td>
                        <select id="Funciones" name ="funcion"></select>
                    </td>
                </tr>
                <tr>
                    <td>&nbsp;&nbsp;Grupo:</td>
                    <td>
                        <select id="Grupos" name ="idGrupo"></select>
                        <html:errors property = "falta_grupoid"/>
                        <html:errors property = "grupo_no_existe"/>
                    </td>
                </tr>
                <tr>
                    <td>&nbsp;&nbsp;En el grupo desde:</td>
                    <td>
                        <html:text size="25" maxlength="20" property="grupoDesde" styleId="grupoDesde"/>
                    </td>
                </tr>
            </table>
            <br>
            <p><font color="red">NOTA: Los campos que tiene * son obligatorios.</font></p>
            <br>
            <html:button property="" styleId="siguiente" value="Siguiente" />
            <html:reset value = "Limpiar" styleId="clean"></html:reset>
            <html:button property="" styleId="atrasAsistencias" value="Atrás" />
        </div>
        <div id="datosSistema">
            <table cellspacing="5px">
                <tr>
                    <td><font color="red">*&nbsp;</font>Usbid:</td>
                    <td>
                        <html:text size="25" maxlength="35" property="usbid"/>
                        <html:errors property = "falta_usbid"/>
                        <html:errors property = "invalid_UsbId"/>
                        <html:errors property = "UsbId_repetido"/>
                    </td>
                </tr>
                <tr>
                    <td><font color="red">*&nbsp;</font>Login:</td>
                    <td>
                        <html:text size="25" maxlength="20" property="login"/>
                        &nbsp;Ej.&nbsp;Pperez

                        <html:errors property = "falta_login"/>
                        <html:errors property = "invalid_login"/>
                        <html:errors property = "login_ya_Existe"/>
                    </td>
                </tr>
            </table>
            <table id="Roles" cellspacing="5px"></table>
            <br>
            <html:submit value = "Agregar" styleId="submit"></html:submit>
            <html:button property="" styleId="atras" value="Atrás" />
        </div>
        <div id="loading"><img alt="Cargando..." src="style/images/cargando.gif"/></div>
        <br>
    </html:form>
    <br/>
</center>
<div style="clear: both;">&nbsp;</div>
<script type="text/javascript">
    $(function(){
        $('#datosEmpleado').hide();
        $('#datosSistema').hide();
        $('#fechaNac').datepicker({
            dateFormat: 'dd/mm/yy',
            maxDate: new Date()+'-15y',
            showOn: "button",
            buttonImage: "style/images/calendar.gif",
            buttonText: "calendario"
        }).attr('readonly', true);
        $('#grupoDesde').datepicker({
            dateFormat: 'dd/mm/yy',
            maxDate: new Date(),
            showOn: "button",
            buttonImage: "style/images/calendar.gif",
            buttonText: "calendario"
        }).attr('readonly', true);
        listaSedes();
        listaGrupos();
        listaHorarios();


        $.getJSON("listaDeFuncion.do",
        function(data) {
            $('#Funciones').html("<option value='' selected>-</option>");
            $.each(data.Funciones, function(i,item){
                var string = "<option value='"+item.id_funcion+"'>"+item.id_funcion+"</option>";
                $('#Funciones').append(string)
            });
            $('#loading').hide();
            setData();
        });        
    });

    $('#siguiente').click(setRoles);
    $('#atras').click(setData);
    $('#atrasAsistencias').click(Asistencias);

    function setData(){
        $('#datosSistema').hide();
        $('#datosEmpleado').show();
    }

    function setRoles(){
        $('#datosEmpleado').hide();
        $('#loading').show();
        listarRoles();
    }

    function listarRoles(){
        $.getJSON("listaRoles.do",
        function(data) {
            $('#Roles').html("");
            cat = "";
            row = 0;
            $.each(data.Roles, function(i,item){
                if(item.categoria != cat){
                    cat = item.categoria;
                    tr = $('<tr>');
                    tr.append($("<th colspan='2'>").append("<br>"+cat+"<hr>"));
                    $('#Roles').append(tr);
                    tr = $('<tr>');
                } else if(row % 2 == 0) tr = $('<tr>');
                tr.append($("<td>").append("<input type='checkbox' name='roles' value='"+item.id+"' id='rol_"+item.id+"' class='rolCheck userRol'> "+ item.nombre));
                $('#Roles').append(tr);
                row++;
                
            });
            $('#loading').hide();
            $('#datosSistema').show();
            $('#rol_1').removeClass('userRol').click(function(){
               checked = ($(this).attr('checked') == 'checked');
               $('.userRol').attr('checked',checked).attr('disabled',checked);
            });
        });
    }
</script>